基于Java spring + vue3 + nuxt构建的内容管理系统
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

69 lines
1.9 KiB

<template>
<div class="banner m-auto text-center pt-[60px]" v-if="form">
<el-image :src="form.photo || config.subpageBanner"></el-image>
</div>
<div class="container">
<div v-if="form" class="flex flex-col w-[1280px] m-auto">
<el-breadcrumb class="my-5" separator="/">
<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
<el-breadcrumb-item>{{ form.name }}</el-breadcrumb-item>
</el-breadcrumb>
<div class="w-7xl m-auto bg-white">
<div class="title text-3xl text-center py-10">{{ form.name }}</div>
<div class="p-4 leading-7" v-html="form.content">
</div>
</div>
</div>
</div>
{{ config }}
{{ token }}
<div v-if="!form">
<el-empty description="404 页面不存在"></el-empty>
</div>
</template>
<script setup lang="ts">
import type {Design} from "~/api/cms/design/model";
import type {ApiResult} from "~/api";
import {useServerRequest} from "~/composables/useServerRequest";
import {useConfigInfo, useToken} from "~/composables/configState";
const route = useRoute();
const { query, params } = route;
const { custom: pageName} = params;
// 网站配置信息
const config = useConfigInfo();
const token = useToken();
// 页面信息
const form = ref<Design | any>();
// 请求数据
const { data: design } = await useServerRequest<ApiResult<Design[]>>('/cms/design', {params: {
path: `/${pageName}`
}})
if (design.value) {
design.value?.data?.map((d,i) => {
if(i == 0){
form.value = d;
console.log(d.name)
useHead({
title: `${d.name} 网宿软件`,
meta: [{ name: "keywords", content: "Nuxt Vue SSR Typescript" }],
bodyAttrs: {
class: "page-container",
},
script: [
{
children: "console.log('Hello World')",
},
],
});
}
})
}
</script>
<style scoped lang="scss">
</style>